import dog from "@/assets/authDog.png"
import { Button } from "@/shared/ui/button"
import { useNavigate } from "react-router-dom"
import { Routes } from "@/shared/consts"

const AuthPage = () => {
  const navigate = useNavigate()
  return (
    <div className="flex-1 flex flex-col justify-between">
      <div className="flex flex-col gap-16">
        <div className="flex flex-col gap-3">
          <h1 className="scroll-m-20 text-4xl font-medium">Привет!</h1>
          <p className="text-lg">
            Рады вас видеть! Войдите или зарегестрируйтесь, чтобы помогать
            собакам
          </p>
        </div>
        <img src={dog} alt="" className="w-[200px] h-auto self-center" />
      </div>
      <div className="flex w-full flex-col gap-4">
        <Button onClick={() => navigate(Routes.Login)}>Войти</Button>
        <Button variant="secondary" onClick={() => navigate(Routes.Register)}>
          Зарегистрироваться
        </Button>
      </div>
    </div>
  )
}
export default AuthPage
